/*
 * @Author: huangtianyang 916072572@qq.com
 * @Date: 2023-11-15 11:00:54
 * @LastEditors: huangtianyang
 * @LastEditTime: 2024-04-28 15:22:41
 * @FilePath: \cxl-driving-training\src\views\questionManagement\list\index.ts
 */
import { BaseData, BaseMethod } from '@/utils/basc-data'
import { tableConfig } from './config'
import router from '@/router'
import { ElMessage } from 'element-plus'
import { reactive, ref } from 'vue'
import { addAsk, askOperation, batchAddAsk, questionAudit, questionList, questionParams } from '@/apis/FAQs'
import { formDataInterface } from '@/utils/interface'
import { userStore } from '@/store/user.store'

interface ImageProps extends formDataInterface {
    value: any[]
}

export default class FAQsData extends BaseData implements BaseMethod {
    search = { content: '', schoolId: '' }
    question = reactive({
        userAvatar: '',
        phone: '',
        createTime: '',
        questionContent: ''
    })
    answer = reactive({
        content: '',
        id: ''
    })
    dialogData = reactive({
        visible: false,
        title: '回答',
        width: '50%',
        hiddenAskInput: false //问答框显示隐藏
    })
    imageData: ImageProps = reactive({
        value: [],
        imageCount: 3,
        videoCount: 0,
        tagVisible: false,
        dirType: 'school',
        sizeRatio: [16, 9]
    })
    askList: { content: string; img: ImageProps }[] = reactive([])
    uStore = userStore()
    constructor() {
        super(tableConfig)
        const options: { label: string; value: string }[] = []
        this.uStore.queryDrivingSchoolSimple((res: Map<string, any>) => {
            res.forEach(item => {
                options.push({ label: item.shortName, value: item.id })
            })
            tableConfig.search[0].options = options
        })
        this.getData()
    }
    getData = (arg?: any) => {
        const params: questionParams = {
            size: this.pageData.pagination.pageSize,
            current: this.pageData.pagination.pageNo
        }
        if (this.search.content) {
            params.content = this.search.content
        }
        if (this.search.schoolId !== '' && this.search.schoolId !== '-1') {
            params.schoolId = this.search.schoolId
        }
        questionList(params).then(res => {
            if (Number(res.data.code) === 200) {
                this.pageData.table.data.length = 0
                this.pageData.pagination.total = res.data.result.total

                const arr: any[] = res.data.result.records

                arr.forEach((element: any) => {
                    element.status = Number(element.auditStatus) === 1 ? true : false
                    // element.totalPassRate = element.totalPassRate + '%'
                    this.pageData.table.data.push(element)
                })
            }
        })
        console.log(params)
    }
    onSearch = (arg?: any) => {
        console.log(arg)
        this.search = arg
        this.getData()
    }
    onReset = (arg?: any) => {
        this.search = { content: '', schoolId: '' }
        this.getData()
    }
    onPaginationChange = (arg?: any) => {
        this.pageData.pagination.pageNo = arg
        this.getData()
    }
    onPaginationSize = (arg?: any) => {
        this.pageData.pagination.pageNo = 1
        this.pageData.pagination.pageSize = arg
        this.getData()
    }
    onOperation = (arg?: any) => {
        const { type, data } = arg
        console.log(type, data)
        if (type === 'look') {
            router.push({
                path: '/FAQs-details',
                query: {
                    type,
                    id: data.id
                    // userAvatar: data.userAvatar,
                    // phone: data.phone,
                    // questionContent: data.content,
                    // createTime: data.createTime
                }
            })
        } else if (type === 'switch') {
            questionAudit({
                id: data.id,
                auditStatus: data.auditStatus === 1 ? 0 : 1
            })
        } else if (type === 'ask') {
            this.dialogData.visible = true
            this.question.userAvatar = data.userAvatar
            this.question.phone = data.phone
            this.question.questionContent = data.content
            this.question.createTime = data.createTime
            this.answer.id = data.id
            this.onAddAsk()
        }
    }
    onAddAsk = () => {
        this.askList.push({
            content: '',
            img: {
                value: [],
                imageCount: 3,
                videoCount: 0,
                tagVisible: false,
                dirType: 'problem',
                sizeRatio: [16, 9]
            }
        })
    }
    onCancel = () => {
        this.askList.length = 0
        this.dialogData.visible = false
    }
    onSave = () => {
        console.log(this.answer, this.askList)
        const data: askOperation[] = []
        let pass = true
        this.askList.forEach(item => {
            if (!item.content) {
                pass = false
            }
            const obj: askOperation = {
                content: item.content,
                problemId: this.answer.id,
                contentPictures: []
            }

            item.img.value.forEach(img => {
                obj.contentPictures?.push(img.list[0].key)
            })
            data.push(obj)
        })
        if (!pass) {
            ElMessage({
                message: '请输入内容',
                type: 'error'
            })
            return
        }

        console.log(data)
        batchAddAsk(data).then(res => {
            if (Number(res.data.code) === 200) {
                ElMessage({
                    message: '回答成功',
                    type: 'success'
                })
                this.askList.length = 0
                this.dialogData.visible = false
            }
        })
    }
    onCloseAsk = (index: number) => {
        this.askList.splice(index, 1)
    }
}
